
<script>
	// 数据详情页
	import {
		defineComponent
	} from 'vue'
	export default defineComponent({
		name: 'WeworkQrList'
	})
</script>
<script setup>
import{groupDataDesc,groupAttetionDataDesc} from './../lib/constant'
import {qrListData,qrDataForm,qrDataListData} from '@/data'
	import MyIcon from '@/components/my-icon/index.vue'
		import {postDataGroup} from '@/api'
	import { ref } from 'vue'
	const queryForm = ref({
		qrId:''
	})

	const qrList = ref([])
	qrList.value = qrListData
	// 集合数据
	const qrDataSet = ref([])
	const getData=async()=>{
		const r = await postDataGroup()
		if (r) {
			localStorage.setItem('widGroup',r.data.wid)
			qrDataSet.value = r.data
		}
	}
	getData()
	// 集合列表
	const qrDataSetList = ref([])
	qrDataSetList.value = qrDataListData

	const multipleTableRef = ref()
	const multipleSelection = ref([])
	const selectAll = ref(false)
	const total = ref(0)

	const exportExcel = () => {
		console.log('导出excel')
	}
	const handleCurrentChange = (val) => {
		console.log(`current page: ${val}分页请求接口`)
		getqrList()
	}
	const handleSelectAll = () => {
		multipleTableRef.value.clearSelection()
		if (selectAll.value) {
			qrDataSetList.value.forEach((row) => {
				multipleTableRef.value.toggleRowSelection(row, undefined)
			})
		}
	}

	const handleSelectionChange = (val) => {
		multipleSelection.value = val
		if (multipleSelection.value.length == qrDataSetList.value.length) {
			selectAll.value = true
		} else {
			selectAll.value = false
		}
	}


  
</script>

<template>
	<div class="app-edit app-gap-block-top">
    <div class="app-container">
     	<div class="table-title">昨日客户群数据
			 <span class="a-ml16 app-words-tip-weak">统计说明	<el-popover width="" popper-style="padding: 0px;min-width:0px" placement="bottom" trigger="hover">
									<div class="app-container margin-fa">
									<div class="margin-son" v-for="(item,index) in groupDataDesc" :key="index">{{item}}</div>
									</div>
									<div class="app-container margin-fa">
									<div class="margin-son" v-for="(item,index) in groupAttetionDataDesc" :key="index">{{item}}</div>
									</div>
									<template #reference>
										<MyIcon class="question-icon weak" name="Question" />
									</template>
								</el-popover></span>
			 </div>
			<div class="app-gap-block-top">
					<el-tag class="app-blue-card" style="width:1000px">
					<div class="app-flex-left">
						<div class="app-card-item app-border-right">
						<div class="app-card-title">{{qrDataSet.size}}</div>
						<div class="app-card-desc">群成员总数</div>
					</div>
					<div class="app-card-item app-border-right">
						<div class="app-card-title">{{qrDataSet.add_customer_size}}</div>
						<div class="app-card-desc">群客户总数</div>
					</div>
					<div class="app-card-item app-border-right">
						<div class="app-card-title">{{qrDataSet.add_size}}</div>
						<div class="app-card-desc">入群人数</div>
					</div>
					<div class="app-card-item app-border-right">
						<div class="app-card-title">{{qrDataSet.del_size}}</div>
						<div class="app-card-desc">退群人数</div>
					</div>


					<div class="app-card-item">
						<div class="app-card-item">
						<div class="app-card-title">{{qrDataSet.add_group_size}}</div>
						<!-- <div class="app-card-desc">活跃人数</div> -->
						<div class="app-card-desc">净增客户数</div>
					</div>
					</div>
					</div>
				</el-tag>
			
				

			</div>

    </div>
    
	<div>
</div>

</div>


</template>
<style lang="scss">
	@import url('../../../../style/app-component.scss');
	@import '../../../../style/mixin.scss';
</style>